<template>
 <div>
   <div style="">
     <div style="" name="checkedReg">
       <div style="width: 100%;background-color: #4472C4;line-height: 35px; font-size: 18px;color:yellow; text-align: center;margin-top: 8px">
         <strong>检验机构监管 {{regular.checkedRegCount}}家</strong><!--标题 -->
       </div>
       <el-table :data="regular.checkedReg" :header-cell-style="{backgroundColor:'#D1DAEA',color:'black',fontWeight:'bold'}" :cell-style="checkedRegCell" size="mini">
         <el-table-column prop="id" label="序号"> </el-table-column>
         <el-table-column prop="checkedOrgName" label="检验机构">  </el-table-column>
         <el-table-column prop="approveNum" label="核准证编号"></el-table-column>
         <el-table-column prop="checkedScope" label="检验范围"></el-table-column>
         <el-table-column prop="validate" label="有效期"> </el-table-column>
         <el-table-column prop="checkedRate" label="定检率">  </el-table-column>
       </el-table>
     </div>
     <div style="" name="usedUnitReg">
       <div style="width: 100%;background-color: #4472C4;line-height: 35px; font-size: 18px;color:yellow; text-align: center;margin-top: 16px">
         <strong>使用单位风险监管 {{regular.usedUnitRegCount}}家</strong>
       </div>
       <el-table :data="regular.usedUnitReg" :header-cell-style="{backgroundColor:'#D1DAEA',color:'black',fontWeight:'blod'}" :cell-style="usedUnitRegCellStyle" size="mini">
         <el-table-column prop="id" label="序号"> </el-table-column>
         <el-table-column prop="usedUnit" label="使用单位">  </el-table-column>
         <el-table-column prop="devCount" label="设备总量"></el-table-column>
         <el-table-column prop="maxCub" label="最大容积"></el-table-column>
         <el-table-column prop="maxCubCount" label="最大容积数量"> </el-table-column>
         <el-table-column prop="riskLevel" label="风险等级">  </el-table-column>
       </el-table>
     </div>
     <div style="" name="tankDevReg">
       <div style="width: 100%;background-color: #4472C4;line-height: 35px; font-size: 18px;color:yellow; text-align: center;height: 15%">
         <strong>储罐设备风险监管{{ regular.tankCount }}台</strong><!--标题 -->
       </div>
       <div style="height: 85%">
         <el-table :data="regular.tankDevReg" :header-cell-style="{backgroundColor:'#D1DAEA',color:'black',fontWeight:'blod'}" :cell-style="tankDevRegCellStyle" size="mini">
           <el-table-column prop="id" label="序号"> </el-table-column>
           <el-table-column prop="riskLevel" label="风险等级">  </el-table-column>
           <el-table-column prop="devName" label="设备名称"></el-table-column>
           <el-table-column prop="devAddr" label="设备地址"></el-table-column>
           <el-table-column prop="usedUnit" label="使用单位"> </el-table-column>
           <el-table-column prop="mainRiskFactor" label="主要风险因素">  </el-table-column>
         </el-table>
       </div>
     </div>
   </div>
 </div>
</template>
<script>
export default {
  name: "RelularedOrg",
  props:{
    regulartor:{
      type:Object,
      default:{}
    }
  },
  data(){
    return{
      regular:{
        checkedRegCount:6,
        checkedReg:[
          {id:'1', checkedOrgName:'山东省特检院',approveNum:"", checkedScope:'',validate:"",checkedRate:'查看'},
          {id:'2', checkedOrgName:'铜陵市特检所',approveNum:"", checkedScope:'',validate:"",checkedRate:'查看'},
          {id:'3', checkedOrgName:'中国特检院',approveNum:"", checkedScope:'',validate:"",checkedRate:'查看'}
        ],
        usedUnitRegCount:245,
        usedUnitReg:[
          {id:'1', usedUnit:'浙能兰溪发电有限责任公司',devCount:4, maxCub:5000,maxCubCount:2,riskLevel:'低'},
          {id:'2', usedUnit:'华能盐池热电有限责任公司',devCount:4, maxCub:5000,maxCubCoun:0,riskLevel:'低'},
          {id:'3', usedUnit:'华润电力（温州）有限公司',devCount:2, maxCub:5000,maxCubCoun:0,riskLevel:'低'},
          {id:'4', usedUnit:'舟山龙宇燃油有限公司',devCount:1, maxCub:1000,maxCubCoun:1,riskLevel:'低'},
          {id:'5', usedUnit:'中国石油天然气股份有限公司青海油田分公司管道输油处',devCount:1, maxCub:0,maxCubCoun:0,riskLevel:'低'},
        ],
        tankCount:281,
        tankDevReg:[
          {id:'1',riskLevel:'4', devName:'T-42',devAddr:'---',usedUnit:"浙能兰溪发电有限责任公司",mainRiskFactor:'容积'},
          {id:'2',riskLevel:'4', devName:'T-43',devAddr:'---',usedUnit:"华能盐池热电有限责任公司",mainRiskFactor:'使用年限'},
          {id:'3',riskLevel:'4', devName:'T-44',devAddr:'---',usedUnit:"华润电力（温州）有限公司",mainRiskFactor:'容积'},
          {id:'4',riskLevel:'4', devName:'T-45',devAddr:'---',usedUnit:"舟山龙宇燃油有限公司",mainRiskFactor:'容积'},
          {id:'5',riskLevel:'4', devName:'T-46',devAddr:'---',usedUnit:"中国石油天然气股份有限公司青海油田分公司管道输油处",mainRiskFactor:'容积'},
        ]
      }
    }
  },
  methods:{
    checkedRegCell:function ({row,column,rowIndex,columnIndex}){
      if(rowIndex%2==1){
        return "background:#D1DAEA"
      }
    },
    usedUnitRegCellStyle:function ({row,column,rowIndex,columnIndex}){
      //先设置行号和列号，显示是是有区别的
      if (columnIndex==3||columnIndex==5){
        if(rowIndex%2==1){
          return "background:#D1DAEA;color:red;fontWeight:bold"
        }else {
          return "color:red;fontWeight:bold"
        }
      }
      if(rowIndex%2==1){
        return "background:#D1DAEA"
      }
    },
    tankDevRegCellStyle:function ({row,column,rowIndex,columnIndex}){
      if (columnIndex==1){
        if(rowIndex%2==1){
          return "background:#D1DAEA;color:red"
        }else {
          return "color:red;fontWeight:bold"
        }
      }
      if(rowIndex%2==1){
        return "background:#D1DAEA"
      }
    }
  },
}
</script>

<style scoped>

</style>
